<template>
  <div>
    <el-collapse v-model="activeName" accordion>
      <el-collapse-item v-for="item in data" :key="item.academyType" :name="item.academyType">
        <template v-if="item.academyType === 1" slot="title">
          <h3>冲击院校</h3>
        </template>
        <template v-if="item.academyType === 2" slot="title">
          <h3>稳争院校</h3>
        </template>
        <template v-if="item.academyType === 3" slot="title">
          <h3>求稳院校</h3>
        </template>
        <template v-if="item.academyType === 4" slot="title">
          <h3>保底院校</h3>
        </template>
        <div v-if="item.reAcademies.length > 0">
          <div v-for="(academy,index) in item.reAcademies.slice(0,20)" :key="academy.acadCode" style="padding-bottom: 15px;margin-bottom: 15px;border-bottom: 1px solid #9999">
            <ResultItem :st="type" :type="item.academyType" :data="academy" :index="index+1" :scores="scores?scores:[]" @view-major="handleViewMajor" />
          </div>
        </div>
        <div v-if="item.reAcademies.length === 0">
          没有合适的院校
        </div>
      </el-collapse-item>
    </el-collapse>

    <el-dialog v-if="visible" :visible.sync="visible" :title="majorTitle" width="80%">
      <div v-for="(major,index) in majors" :key="index" style="border: #d7dae2 1px solid;margin-bottom: 10px;padding: 10px;">
        <ResultMajor :data="major" :index="index+1" :scores="majorScores" />
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { queryMajors } from '../../../../api/query'
export default {
  name: 'Solution',
  components: {
    ResultItem: () => import('./ResultItem'),
    ResultMajor: () => import('./ResultMajor')
  },
  props: {
    data: {
      type: [Array],
      required: true
    },
    scores: {
      type: [Array],
      required: true
    },
    type: {
      type: [String, Number],
      required: true
    },
    user: {
      type: [Object],
      required: true
    }
  },
  data() {
    return {
      majors: [],
      visible: false,
      activeName: '1',
      majorTitle: '专业详情',
      majorScores: []
    }
  },
  methods: {
    handleViewMajor({ majors, academy }) {
      console.log(majors, academy)
      const loading = this.$loading({
        lock: true,
        text: '玩儿命加载中',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      })
      // const inMajors = []
      // for (let i = 0; i < majors.length; i++) {
      //   inMajors.push(majors[i]['majName'])
      // }
      queryMajors({
        level: this.user.level,
        type: this.user.division,
        province: this.user.province,
        academy_code: academy.acadCode
        // majors: inMajors
      }).then(res => {
        this.majors = majors
        this.majorScores = res.majorScores
        this.visible = true
      }).finally(() => {
        loading.close()
      })
    }
  }
}
</script>

<style scoped>

</style>
